body {
  font-family: "Arial";
}

.img-res {
  width: 100%;
  max-width: 100%;
}

.banner {
  margin-bottom: 20px;
}

.banner img {
  margin-bottom: 20px;
}

.bg1 {
  background: #4c98d2;
  color: #fff;
  position: relative;
  padding: 20px 15px;
}

@media (min-width: 1000px) {
  .bg1 {
    margin-top: -40px;
  }
}

@media (min-width: 1200px) {
  .bg1 {
    transform: skew(-10deg);
    margin-top: -70px;
  }
}

.bg1 p {
  line-height: 24px;
}

@media (min-width: 1200px) {
  .bg1 p {
    transform: skew(10deg);
  }
}

.bg1 p span {
  font-size: 22px;
}

.app-h2 {
  font-size: 22px;
  color: #2883c9;
  margin-bottom: 25px;
}

.app-p1 {
  margin-top: 25px;
  margin-bottom: 20px;
}

.eq {
  margin-bottom: 20px;
}

.eq img {
  margin: 0 auto;
  margin-bottom: 10px;
}

.eq-h3 {
  font-size: 18px;
  margin-bottom: 10px;
  line-height: 28px;
  color: #545454;
}

.eq-p1 {
  font-weight: bold;
  color: #18639f;
  border-left: 3px solid #18639f;
  padding-left: 15px;
}

.eq-p2 {
  background: #2883c9;
  color: #fff;
  line-height: 28px;
  padding: 25px 25px 20px 15px;
}

@media (min-width: 1000px) {
  .eq-p2 {
    line-height: 35px;
    padding: 25px 25px 40px 15px;
  }
}

.ea-l {
  margin-bottom: 20px;
}

.ea-l img {
  margin: 0 auto;
}

.ea-r {
  margin-bottom: 20px;
}

.bg2 {
  background: url(../ts.jpg) center center no-repeat;
  margin-bottom: 20px;
}

.ea {
  color: #fff;
  padding: 10px 15px 10px;
}

@media (min-width: 760px) {
  .ea {
    padding: 10px 15px 20px;
  }
}

@media (min-width: 1000px) {
  .ea {
    padding: 20px 15px 30px;
  }
}

@media (min-width: 1200px) {
  .ea {
    padding: 30px 40px 50px;
  }
}

.ea img {
  margin: 0 auto;
}

@media (min-width: 360px) {
  .ea img {
    margin-bottom: 10px;
  }
}

@media (min-width: 1200px) {
  .ea img {
    margin-bottom: 20px;
  }
}

.ea h3 {
  font-size: 24px;
}

@media (min-width: 760px) {
  .ea h3 {
    margin-bottom: 10px;
  }
}

@media (min-width: 1200px) {
  .ea h3 {
    margin-bottom: 20px;
  }
}

.ea p {
  margin-bottom: 0;
}

.ps-hid {
  overflow: hidden;
  position: relative;
  margin-bottom: 20px;
}

.ps-hid:hover div {
  bottom: 0;
}

.ps-hid div {
  position: absolute;
  left: 0;
  right: 0;
  background: rgba(53, 125, 181, 0.8);
  padding: 7px 10px;
  color: #fff;
  transition: all 0.5s ease-in-out;
}

.ps-hid div p span {
  font-size: 18px;
}

.ps-hid .hid1 {
  bottom: -90px;
}

@media (min-width: 388px) {
  .ps-hid .hid1 {
    bottom: -65px;
  }
}

@media (min-width: 679px) {
  .ps-hid .hid1 {
    bottom: -40px;
  }
}

@media (min-width: 760px) {
  .ps-hid .hid1 {
    bottom: -115px;
  }
}

@media (min-width: 1000px) {
  .ps-hid .hid1 {
    bottom: -90px;
  }
}

@media (min-width: 1200px) {
  .ps-hid .hid1 {
    bottom: -65px;
  }
}

.ps-hid .hid2 {
  bottom: -65px;
}

@media (min-width: 531px) {
  .ps-hid .hid2 {
    bottom: -40px;
  }
}

@media (min-width: 760px) {
  .ps-hid .hid2 {
    bottom: -90px;
  }
}

@media (min-width: 1000px) {
  .ps-hid .hid2 {
    bottom: -65px;
  }
}

@media (min-width: 1200px) {
  .ps-hid .hid2 {
    bottom: -65px;
  }
}

.ps-hid .hid3 {
  bottom: -65px;
}

@media (min-width: 630px) {
  .ps-hid .hid3 {
    bottom: -40px;
  }
}

@media (min-width: 760px) {
  .ps-hid .hid3 {
    bottom: -115px;
  }
}

@media (min-width: 1000px) {
  .ps-hid .hid3 {
    bottom: -90px;
  }
}

@media (min-width: 1200px) {
  .ps-hid .hid3 {
    bottom: -65px;
  }
}

.mb-f {
  margin-bottom: 20px;
}

@media (min-width: 1000px) {
  .mb-f {
    margin-bottom: 30px;
  }
}
